<!-- "title" attribute here is needed to override the "title" attribute that
     will be set in grr-confirmation-dialog (that will be one level above)
     and that will contain an Angular template expression. "title"
     attribute is used by nested DOM elements when showing tooltips. -->
<div ng-attr-title="{$ title $}">

  <div class="modal-header">
    <button type="button" class="close" ng-click="controller.dismiss()">
      <span aria-hidden="true">&times;</span>
      <span class="sr-only">Close</span>
    </button>
    <h3 class="modal-title">{$ title $}</h3>
  </div>

  <div class="modal-body">
    <ng-transclude></ng-transclude>
  </div>

  <div class="modal-footer" ng-if="!controller.success && !controller.error">
    <button class="btn btn-default"
            ng-click="controller.dismiss()"
            ng-attr-title="{$ cancelName || 'Cancel' $}"
            name="Cancel">
      {$ cancelName || 'Cancel' $}
    </button>

    <button class="btn {$ proceedClass || 'btn-primary' $}"
            ng-click="controller.proceed()"
            ng-disabled="canProceed && !canProceed()"
            ng-attr-title="{$ proceedName || 'Proceed' $}"
            name="Proceed">
      {$ proceedName || 'Proceed' $}
    </button>
  </div>

  <div class="modal-footer" ng-if="controller.success || controller.error">
    <span class="text-success horizontally-padded"ng-if="controller.success">
      <span class="glyphicon glyphicon-ok"></span>
      <strong>{$ controller.success $}</strong>
    </span>

    <span class="text-danger horizontally-padded" ng-if="controller.error">
      <span class="glyphicon glyphicon-exclamation-sign"></span>
      <strong>{$ controller.error $}</strong>
    </span>

    <button class="btn btn-default"
            ng-click="controller.close()"
            ng-attr-title="{$ closeName || 'Close' $}"
            name="Close">
      {$ closeName || 'Close' $}
    </button>
  </div>

</div>
